<template>
	<view class="nav-bar-container">
		<scroll-view>
			<view 
				class="nav-bar"
				:class="{active:index===activeIndex}"
				v-for="(item,index) in dynastyList"
				:key="index"
				@click="setActive(index)"
			>
				{{item}}
			</view>
		</scroll-view>
		<view class="nav-bar-height"></view>
	</view>
</template>

<script>
	export default {
		name:"NavBar",
		data() {
			return {
				
			};
		},
		props:{
			dynastyList:Array,
			activeIndex:Number
		},
		methods:{
			setActive(index){
				// this.activeIndex=index;
				this.$emit("setActive",index);
			}
		}
	}
</script>

<style scoped lang="scss">
@import "./css/NavBar.scss";
</style>
